﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>hubpage</title>
    <script src="../../js/ws.js"></script>
    <!-- WinJS references -->
    <link href="//Microsoft.WinJS.2.0/css/ui-light.css" rel="stylesheet" />
    <script src="//Microsoft.WinJS.2.0/js/base.js"></script>
    <script src="//Microsoft.WinJS.2.0/js/ui.js"></script>

    <link href="/css/kendo.common.min.css" rel="stylesheet" />
    <link href="/css/kendo.metro.min.css" rel="stylesheet" />
    <link href="/css/indexcommon.css" rel="stylesheet" />

    <script src="/js/jquery.min.js"></script>
    <script src="/js/kendo.web.min.js"></script>
    <script src="/js/cultures/kendo.culture.vi-VN.min.js"></script>
    <script src="/js/site.js"></script>
    <script src="/js/common.js"></script>
    <script src="/js/Data.js"></script>

    <link href="sessionpage.css" rel="stylesheet" />
    <script src="sessionpage.js"></script>
</head>
<body>
    <script>
        GenarateNavBar();
    </script>
    <!-- These templates are used to display each item in the ListView declared below. -->
    <div class="headertemplate" data-win-control="WinJS.Binding.Template">
        <div class="titlemodule"><h2 data-win-bind="textContent: CustomName"></h2></div>
    </div>

    <div class="itemtemplateGrooup" data-win-control="WinJS.Binding.Template">
        <div class="item">
            <div class="item-function">
                <div data-win-bind="className: Module" style="width:100%;height:100%">
                    <h4 class="item-title" data-win-bind="textContent: CustomName"></h4>
                </div>
            </div>
        </div>
    </div>

    <!--<div id="loading" style="margin:0px;position: fixed; width: 100%; height: 100%; z-index: 1000; background: url('/images/bgHubPage.png');">
        
    </div>
    <script>
        $("#loading").offset({ top: 0 });
        $("#loading").append($('<progress class="indeterminate" style="width:100%"></progress>'));
    </script>-->
    <div class="hubpage fragment">
        <header class="header" aria-label="Header content" role="banner">
            <div>
                <button style="float:left;margin-top:15px;margin-right:20px" title="Back" class="win-navigation-backbutton win-disposable" aria-label="Back" type="button">
                    <span class="win-back"></span>
                </button>
                <h1 style="float:left" data-win-bind="textContent: module.Title"></h1>
            </div>
        </header>
        <section id="grid" role="main">
            <div class="groupeditemslist win-selectionstylefilled" aria-label="List of groups" data-win-control="WinJS.UI.ListView" data-win-options="{
                layout: {type: WinJS.UI.GridLayout, groupHeaderPosition: 'top'},
                selectionMode: 'none',
                currentItem: {type: WinJS.UI.ObjectType.item, index: 0, hasFocus: true},
                groupDataSource: Data.groups.dataSource,
                groupHeaderTemplate: select('.headertemplate'),
                itemDataSource: Data.items.dataSource,
                itemTemplate: select('.itemtemplateGrooup'),
                oniteminvoked: select('.pagecontrol').winControl.itemInvoked
            }">
            </div>
        </section>
    </div>
</body>
</html>
